<script setup>
import {onMounted, ref} from 'vue';
import {useConfigStore} from '@/stores/config';
import {ipc} from "@/utils/ipcRenderer";
import {ipcApiRoute} from "@/api/rpcRouter";

const configStore = useConfigStore();

const placeholder = ref(["从", "到"])

const configInfo = ref({
  pbUrl: "",
  pbUserName: "",
  pbPassWord: "",
  imUrl: "",
  frequency: [],
  amount: null,
  bettingInterval: null,
})


const saveConfig = async () => {
  ipc.invoke(ipcApiRoute.saveConfig, {key: "glob_key", value: JSON.stringify(configInfo.value)}).then(res => {
    if (res) {
      window.$message.success("保存成功")
      configStore.setConfig(configInfo.value)
    }
  })
}

onMounted(async () => {
  // 获取对应的配置信息
  configInfo.value = configStore.config
});

</script>

<template>
  <n-flex vertical>

    <n-divider title-placement="left">
      平博设置
    </n-divider>
    <n-flex>
      <n-gradient-text type="warning" :size="15">平博地址 :</n-gradient-text>
      <n-input with="300px" placeholder="平博平台地址" v-model:value="configInfo.pbUrl"/>
    </n-flex>

    <n-space>
      <n-gradient-text type="success" :size="20">账号 :</n-gradient-text>
      <n-input
        show-password-on="mousedown"
        placeholder="平博账号"
        v-model:value="configInfo.pbUserName"
      />
      <n-gradient-text type="success" :size="20">密码 :</n-gradient-text>
      <n-input
        type="password"
        show-password-on="mousedown"
        placeholder="平博密码"
        v-model:value="configInfo.pbPassWord"
      />
    </n-space>


    <n-divider title-placement="left">
      IM设置
    </n-divider>
    <n-flex>
      <n-gradient-text type="warning" :size="15">IM地址 :</n-gradient-text>
      <n-input placeholder="IM平台地址" v-model:value="configInfo.imUrl"/>
    </n-flex>

    <n-divider title-placement="left">
      投注设置
    </n-divider>
    <n-space align="center">
      <n-gradient-text type="success" :size="20">扫描频率 :</n-gradient-text>
      <n-input
        pair
        separator="-"
        :placeholder="placeholder"
        clearable
        v-model:value="configInfo.frequency"
      />
      <n-text>（单位：毫秒，从最小值-最大值区间随机值）</n-text>
    </n-space>
    <n-space align="center">
      <n-gradient-text type="error" :size="20">投注金额 :</n-gradient-text>
      <n-input-number placeholder="投注金额" v-model:value="configInfo.amount"></n-input-number>
      <n-gradient-text type="success" :size="20">投注间隔 :</n-gradient-text>
      <n-input placeholder="投注间隔" v-model:value="configInfo.bettingInterval"></n-input>
    </n-space>

    <n-divider title-placement="left">
    </n-divider>
    <n-space align="center" justify="start">
      <n-button size="large" type="success" @click="saveConfig">保存设置</n-button>
    </n-space>
  </n-flex>

</template>

<style scoped>
n-divider {
  margin-top: 0;
}

n-gradient-text {
  font-size: 36px;
}
</style>
